/**
 * 底部播放栏
 */

import React, { memo, useRef } from 'react';
import ProgressBar from '@/components/Progress';
import Control from '@/components/Control';


function Player() {
  const audioRef = useRef();
  return (
    <div className="player">
      {/* 左侧 */}
      <div className="player-left">
        <div className="img">
          <img src="../../assets/images/cover.jpg" style={{height: "100%"}} alt="" />
        </div>
        <div className="text">
          <div className="song">Tomorrow</div>
          <div className="singer">哈哈哈哈</div>
        </div>
      </div>
      {/* 中间 */}
      <div className="player-center">
        <Control />
        <ProgressBar />
      </div>
      <div className="player-right">右边</div>
      <audio ref= {audioRef}></audio>
    </div>
  )
}

export default memo(Player)
